<template>
	<view>
		<view class="" style="position: fixed;top: 0;width: 100%;z-index: 100;">
			<view class="" style="position: relative;">
				<view class="status_bar">
				          <!-- 这里是状态栏 -->
				</view>
				<view class="uni-flex search" >
					<image src="../../static/image/fanhui.png" mode="" class="logo" @tap="fanhui()"></image>
					<uni-search-bar :radius="32" @confirm="search" bgColor="#F6F8F8" placeholder="搜索买家用户ID或手机号" style="flex: 1;" ></uni-search-bar>
					
				</view>
			</view>
		</view>
		<view class="" style="position: relative;margin-top: 120rpx;z-index: 0;">
			
			<view class="" v-if="userList.length==0" style="position: absolute;margin: auto;top:300rpx;left: 0;right: 0;width: 300rpx;text-align: center;">
				<image  src="../../static/image/nodata1.png" mode="" style="width: 300rpx;height: 200rpx;"></image>
				暂无数据
			</view>
			
			<view class="" style="padding-top: 20rpx;" v-for="(item,index) in userList" :key="item.id" @tap="linkTo(item)">
				<view class="oneTui uni-flex">
					<view class="" style="position: relative;margin-right: 20rpx;">
						<view class="touxiang">
							<image :src="$jiekou.uploadBaseUrl+item.head" mode="" class=""></image>
						</view>
						<!-- <view :class="[item.Status=='Online'?'zaixian':'','yuandian']"></view> -->
						
					</view>
					<view class="neirong">
						<view class="uni-flex">
							<view class="" style="flex: 1;">
								<text class="user-name">{{item.username}}</text>
								<image v-if="item.attestation==2" src="../../static/image/yirenzheng.png" mode="" class="renzhengtu"></image>
								<view class="" v-if="item.qu!=undefined" style="color: #8799A3;">{{item.sheng}}.{{item.shi}}.{{item.qu}}</view>
							</view>
							<view class="pingding">综合评定:{{zonghepingfen[item.pingfen]}}</view>
						</view>
						<view class="biaoqians uni-flex" style="margin-top: 5rpx;">
							<view class="biaoqian">{{maijiashangjia[item.type]}}ID：{{item.id}}</view>
							<view v-if="item.tuanduiid!=undefined && item.tuanduiid!=''" class="biaoqian">团队ID：{{item.tuanduiid}}</view>
						</view>
					</view>
				</view>
			</view>
			<!-- <view class="" style="padding-top: 20rpx;">
				<view class="oneTui uni-flex">
					<view class="" style="position: relative;margin-right: 16rpx;">
						<view class="touxiang">
							<image src="../../static/image/shouchi.png" mode="" class=""></image>
						</view>
						<view class=" yuandian "></view>
					</view>
					<view class="neirong">
						<view class="uni-flex">
							<text class="user-name">鱼汤有鱼</text>
							<image  src="../../static/image/yirenzheng.png" mode="" class="renzhengtu"></image>
						</view>
						<view class="biaoqians uni-flex">
							<view class="biaoqian">商家ID：23452</view>
							<view class="biaoqian">团队ID：23452</view>
						</view>
					</view>
				</view>
			</view>
			<view class="" style="padding-top: 20rpx;">
				<view class="oneTui uni-flex">
					<view class="" style="position: relative;margin-right: 16rpx;">
						<view class="touxiang">
							<image src="../../static/image/shouchi.png" mode="" class=""></image>
						</view>
						<view class=" yuandian "></view>
					</view>
					<view class="neirong">
						<view class="uni-flex">
							<text class="user-name"></text>
							<image src="../../static/image/yirenzheng.png" mode="" class="renzhengtu"></image>
						</view>
						<view class="biaoqians uni-flex">
							<view class="biaoqian">商家ID：23452</view>
							<view class="biaoqian">团队ID：23452</view>
						</view>
					</view>
				</view>
			</view> -->
		</view>
	</view>
</template>

<script>
	
	import http from '@/common/http.js'
	
	export default {
		data() {
			return {
				zonghepingfen:{},
				userList:[],
				searchStr:"",
				maijiashangjia:{1:"买家",2:"商家"}
			}
		},
		 onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数
			var that = this;
			let usertype = 1;
			var userInfo = uni.getStorageSync("userInfo");
			if(userInfo.type==1){
				usertype = 2;
			}
			this.$util.getDictObject("zonghepingfen").then(res=>{
				that.zonghepingfen = res;
			})
			this.loadData({keysearch:option.keysearch,usertype});
			
			
		},
		onPullDownRefresh() {
			var that = this;
			let usertype = 1;
			this.loadData({keysearch:this.searchStr,usertype});
			
		},
		methods: {
			fanhui(){
				uni.navigateBack({})
			},
			search:function(data){
				
				var that = this;
				let usertype = 1;
				var userInfo = uni.getStorageSync("userInfo");
				this.$util.getDictObject("zonghepingfen").then(res=>{
					that.zonghepingfen = res;
				})
				this.searchStr = data.value;
				this.loadData({keysearch:data.value,usertype});
			},
			//跳转
			linkTo(tim) {
				// uni.setStorageSync("meHead",this.$jiekou.uploadBaseUrl+tim.head);
				// // this.$u.route({
				// // 	url: 'pages/chat/chat',
				// // 	params: { 
				// // 		meUserID:tim.id,
				// // 		messageId: "C2C"+tim.id,
				// // 	}
				// // });
				// this.$store.commit('createConversationActive', tim.id)
				// uni.navigateTo({
				// 	url: '../chat/chat'
				// })
				uni.navigateTo({
					url: './maijiainfo?id='+tim.id
				})
			},
			
			loadData (data) {
				var that = this;
				that.$util.nuiAjax(that.$jiekou.selectUser,data,function(res){
					that.userList = res.data;
					uni.stopPullDownRefresh();
				});
				
				// await http(this.$jiekou.selectUser,data, {
				// 	hideLoading: false, // 默认 false
				// 	hideMsg: true, // 默认 false
				// 	method: 'POST' // 默认 POST
				// }).then(res => {
				// 	// console.log(res.data);
				// 	that.userList = res.data;
				// 	console.log(that.userList);
				// 	uni.stopPullDownRefresh();
				// }).catch(err => {
				// 	console.error(err);
				// })
				
			}
		}
	}
</script>

<style lang="scss">
	.search{
		background-color: #FFFFFF;
	}
	.status_bar {
	      height: var(--status-bar-height);
	      width: 100%;
		  background-color: #FFFFFF;
	  }
	.logo{
		  width: 25rpx;
		  height: 40rpx;
		  margin-left: 36rpx;
		  margin-right: 20rpx;
		  margin-top: 30rpx;
	}
	
	.pingding{
		height:40rpx;
		font-size:28rpx;
		font-weight:400;
		color:rgba(51,51,51,1);
		line-height:40rpx;
		padding-right: 30rpx;
	}
	.oneTui .zaixian{
		background-color: #10C82E;
	}
	.yuandian{
		position: absolute;
		width: 24rpx;
		height: 24rpx;
		border-radius:24rpx;
		background-color: #818181;
		right: 0;
		bottom: 4rpx;
		
	}
	page{
		background-color: $page-bg-color;
		height: 100%;
	}
	.oneTui{
		padding: 30rpx 0 32rpx 30rpx;
		background-color: #FFFFFF;
		
	}
	.touxiang{
		width: 92rpx;
		height: 92rpx;
		border-radius:50rpx;overflow: hidden;
	}
	.touxiang image{
		width: 100%;
		height: 100%;
	}
	.user-name{
		height:44rpx;
		font-size:32rpx;
		font-weight:500;
		color:rgba(25,25,25,1);
		line-height:44rpx;
		padding-right: 8rpx;
	}
	.renzhengtu{
		width: 26rpx;
		height: 32rpx;
		margin-top: 6rpx;
	}
	.biaoqian{
		height:36rpx;
		font-size:24rpx;
		font-weight:400;
		color:$uni-color-primary;
		line-height:36rpx;
		border: 1rpx solid $uni-color-primary;
		border-radius: 4rpx;
		padding: 0 8rpx 0 8rpx;
		margin-right: 8rpx;
	}
	.neirong{
		margin-bottom: 10rpx;
		flex: 1;
	}
</style>
